.footer-buy{
	width: 196px;
    margin: 0 auto;
}
.footer-buy a.btn {
	display: block;
	position: absolute;
	/* width: 150px; */
	background: #4595e6; /*背景颜色*/
	color: #eee;         /*字体颜色*/
	text-align: center;
	font-size: 18px;
	line-height: 60px;
	border-radius: 30px;
	padding: 0 60px;
	text-transform: uppercase;
	letter-spacing: 1px;
	overflow: hidden;
	cursor: pointer;
	z-index: 1;
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	transition: all .3s;
	text-decoration:none;
}

.footer-buy a.btn:after {
	content: '';
	position: absolute;
	width: 0;
	height: 103%;
	top: 50%;
	left: 50%;
	border-radius: 30px;
	background: #65a6e8; /*鼠标放上去字体颜色*/
	opacity: 1;
	z-index: -1;
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	transition: all .3s;
	-webkit-transform: translateX(-50%) translateY(-50%);
	-moz-transform: translateX(-50%) translateY(-50%);
	-ms-transform: translateX(-50%) translateY(-50%);
	transform: translateX(-50%) translateY(-50%)
}

.footer-buy a.btn:hover:after {
	width: 100%
}

.footer-buy a.btn:hover>span {
	display: inline-block
}

.footer-buy a.btn:hover>span:nth-child(odd) {
	-webkit-animation: anim-nanuk-1 .5s forwards;
	animation: anim-nanuk-1 .5s forwards
}

.footer-buy a.btn:hover>span:nth-child(even) {
	-webkit-animation: anim-nanuk-2 .5s forwards;
	animation: anim-nanuk-2 .5s forwards
}

.footer-buy a.btn:hover>span:nth-child(odd),.footer-buy a.btn:hover>span:nth-child(even) {
	-webkit-animation-timing-function: cubic-bezier(0.75,0,0.125,1);
	transition-animation-function: cubic-bezier(0.75,0,0.125,1)
}

.footer-buy a.btn:hover>span:nth-child(1) {
	-webkit-animation-delay: 0s;
	animation-delay: 0s
}

.footer-buy a.btn:hover>span:nth-child(2) {
	-webkit-animation-delay: .05s;
	animation-delay: .05s
}

.footer-buy a.btn:hover>span:nth-child(3) {
	-webkit-animation-delay: .1s;
	animation-delay: .1s
}

.footer-buy a.btn:hover>span:nth-child(4) {
	-webkit-animation-delay: .15s;
	animation-delay: .15s
}
@-webkit-keyframes anim-nanuk-1 {
	0%,100% {
		opacity: 1;
		-webkit-transform: translate3d(0,0,0);
		transform: translate3d(0,0,0)
	}

	49% {
		opacity: 1;
		-webkit-transform: translate3d(0,100%,0);
		transform: translate3d(0,100%,0)
	}

	50% {
		opacity: 0;
		-webkit-transform: translate3d(0,100%,0);
		transform: translate3d(0,100%,0);
		color: inherit
	}

	51% {
		opacity: 0;
		-webkit-transform: translate3d(0,-100%,0);
		transform: translate3d(0,-100%,0);
		color: #fff
	}

	100% {
		color: #fff
	}
}

@keyframes anim-nanuk-1 {
	0%,100% {
		opacity: 1;
		-webkit-transform: translate3d(0,0,0);
		transform: translate3d(0,0,0)
	}

	49% {
		opacity: 1;
		-webkit-transform: translate3d(0,100%,0);
		transform: translate3d(0,100%,0)
	}

	50% {
		opacity: 0;
		-webkit-transform: translate3d(0,100%,0);
		transform: translate3d(0,100%,0);
		color: inherit
	}

	51% {
		opacity: 0;
		-webkit-transform: translate3d(0,-100%,0);
		transform: translate3d(0,-100%,0);
		color: #fff
	}

	100% {
		color: #fff
	}
}

@-webkit-keyframes anim-nanuk-2 {
	0%,100% {
		opacity: 1;
		-webkit-transform: translate3d(0,0,0);
		transform: translate3d(0,0,0)
	}

	49% {
		opacity: 1;
		-webkit-transform: translate3d(0,-100%,0);
		transform: translate3d(0,-100%,0)
	}

	50% {
		opacity: 0;
		-webkit-transform: translate3d(0,-100%,0);
		transform: translate3d(0,-100%,0);
		color: inherit
	}

	51% {
		opacity: 0;
		-webkit-transform: translate3d(0,100%,0);
		transform: translate3d(0,100%,0);
		color: #fff
	}

	100% {
		color: #fff
	}
}

@keyframes anim-nanuk-2 {
	0%,100% {
		opacity: 1;
		-webkit-transform: translate3d(0,0,0);
		transform: translate3d(0,0,0)
	}

	49% {
		opacity: 1;
		-webkit-transform: translate3d(0,-100%,0);
		transform: translate3d(0,-100%,0)
	}

	50% {
		opacity: 0;
		-webkit-transform: translate3d(0,-100%,0);
		transform: translate3d(0,-100%,0);
		color: inherit
	}

	51% {
		opacity: 0;
		-webkit-transform: translate3d(0,100%,0);
		transform: translate3d(0,100%,0);
		color: #fff
	}

	100% {
		color: #fff
	}
}